<template>
  <div>
    <div>
      <div class="dialogBox">
        <!-- 弹窗上方新增需求模块 -->
        <div class="dialogTopBox">
          <el-form ref="basicForm" style="margin: 0 auto" :model="basicForm" :rules="basicRules" label-width="130px" inline="true" size="mini">
            <el-row :gutter="20">
              <el-col :span="8">
                <el-form-item label="需求编号:" prop="demandCode">
                  <el-input disabled v-model="basicForm.demandCode" style="width: 200px" maxlength="12" clearable></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="货物品牌:" prop="goodBrand">
                  <el-select v-model="basicForm.goodBrand" clearable style="width: 200px" :disabled="disabled">
                    <el-option v-for="(item, index) in goodBrands" :key="index" :value="item.brandCode" :label="item.brandName"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="规格:" prop="dailyOutput">
                  <el-select v-model="basicForm.dailyOutput" clearable :disabled="disabled" style="width: 200px">
                    <el-option v-for="(item, index) in dailyOutputs" :key="index" :value="item.normCode" :label="item.normName"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="20">
              <el-col :span="8">
                <el-form-item label="产品大类:" prop="projuctBig">
                  <el-select v-model="basicForm.projuctBig" clearable style="width: 200px" :disabled="disabled">
                    <el-option v-for="(item, index) in projuctBigs" :key="index" :value="item.bcCode" :label="item.bcName"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :span="8">
                <el-form-item label="品种:" prop="kind">
                  <el-select v-model="basicForm.kind" style="width: 200px" @change="getGoodsNum" clearable :disabled="disabled">
                    <el-option v-for="(item, index) in kinds" :key="index" :value="item.varCode" :label="item.varName"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="结算方式:" prop="settlementWay">
                  <el-select v-model="basicForm.settlementWay" style="width: 200px" clearable :disabled="disabled">
                    <el-option v-for="(item, index) in jiesuanWays" :key="index" :value="item.rvLowValue" :label="item.rvCmeaning"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="20">
              <el-col :span="8">
                <el-form-item label="货物编码:" prop="goodCode" v-if="false">
                  <el-input :disabled="disabled" style="width: 200px" v-model="basicForm.goodCode" maxlength="8" clearable></el-input>
                </el-form-item>
              </el-col>

              <el-col :span="8">
                <el-form-item label="运输类型:" prop="transportType">
                  <el-select v-model="basicForm.transportType" style="width: 200px" @change="getType" clearable :disabled="disabled">
                    <el-option v-for="(item, index) in transportTypes" :key="index" :value="item.rvLowValue" :label="item.rvCmeaning"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :span="8">
                <el-form-item label="运输方式:" prop="transportMode">
                  <el-select v-model="basicForm.transportMode" clearable style="width: 200px" :disabled="disabled">
                    <el-option v-for="(item, index) in transportModels" :key="index" :value="item.rvLowValue" :label="item.rvCmeaning"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="运输数量(吨):" prop="transportQuantity">
                  <el-input :disabled="disabled" v-model="basicForm.transportQuantity" style="width: 200px" maxlength="8" clearable></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="20">
              <el-col :span="8">
                <el-form-item label="履约保证金（元）:" prop="performanceBond">
                  <el-input :disabled="disabled" v-model="basicForm.performanceBond" style="width: 200px" maxlength="6" clearable></el-input>
                </el-form-item>
              </el-col>

              <el-col :span="8">
                <el-form-item label="要求开始时间:" prop="requiredStartTime">
                  <el-date-picker
                    v-model="basicForm.requiredStartTime"
                    type="date"
                    clearable
                    default-value
                    :picker-options="startPickerOptions"
                    placeholder="选择要求开始时间"
                    value-format="yyyy-MM-dd"
                    :disabled="disabled"
                    style="width: 200px"
                    @change="getWillDateByStart"
                  >
                  </el-date-picker>
                </el-form-item>
              </el-col>

              <el-col :span="8">
                <el-form-item label="要求完成天数:" prop="requiredEndDay">
                  <el-input
                    :disabled="disabled"
                    style="width: 200px"
                    v-model="basicForm.requiredEndDay"
                    maxlength="3"
                    @input="getWillDate"
                    clearable
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="预计完成时间:" prop="requiredEndTime">
                  <el-date-picker
                    v-model="basicForm.requiredEndTime"
                    type="date"
                    clearable
                    style="width: 200px"
                    :picker-options="endPickerOptions"
                    placeholder="请填写要求完成天数"
                    value-format="yyyy-MM-dd"
                    disabled
                  >
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="22">
                <el-form-item label="备注:" prop="remark">
                  <el-input :disabled="disabled" type="textarea" v-model="basicForm.remark" maxlength="80" style="width: 600px"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </div>
        <!-- 弹窗下方线路信息模块 -->
        <div class="dialogBotBox">
          <div class="botTitl">线路信息</div>
          <div class="botBtnBox">
            <el-button v-if="!disabled" plain size="mini" type="primary" @click="lineInfoHistory">常用起始地</el-button>
            <el-button v-if="!disabled" plain size="mini" type="primary" @click="lineInfoHistory2">常用目的地</el-button>
          </div>
          <div class="solveDetailTable">
            <el-form ref="demandLineInfos" :model="basicForm">
              <el-table
                :data="basicForm.demandLineInfos"
                highlight-current-row
                border
                :height="solveDetailTableHeight"
                :header-cell-style="{ textAlign: 'center' }"
                @row-click="getMainBotCurrent"
              >
                <el-table-column type="index" align="center" width="60" label="序号"></el-table-column>
                <el-table-column label="起始地的省市区县" width="400">
                  <template slot-scope="scope">
                    <el-form-item
                      :prop="`demandLineInfos.${scope.$index}.startSelect`"
                      :rules="[{ validator: startPlaceValidate, trigger: ['change', 'blur'] }]"
                    >
                      <el-cascader
                        v-model="scope.row.startSelect"
                        :options="provinceCityTree"
                        size="mini"
                        :props="cascaderProps"
                        @change="startPlaceChangeHandler(scope.$index)"
                        style="width: 100%"
                        filterable
                        clearable
                      ></el-cascader>
                    </el-form-item>
                    <!--<el-row :gutter="5">-->
                    <!--  <el-col :span="8">-->
                    <!--    <el-form-item v-if="scope.row.status" :prop="'demandLineInfos.' + scope.$index + '.dliSProvince'" :rules="LineInfoRules.dliSProvince">-->
                    <!--      <el-select clearable size="mini" v-model="scope.row.dliSProvince" :disabled="disabled" @change="getCityS(scope.row)" filterable>-->
                    <!--        <el-option v-for="(item, index) in province" :key="index" :label="item.prvChnname" :value="item.prvCode"></el-option>-->
                    <!--      </el-select>-->
                    <!--    </el-form-item>-->
                    <!--  </el-col>-->
                    <!--  <el-col :span="8">-->
                    <!--    <el-form-item v-if="scope.row.status" :prop="'demandLineInfos.' + scope.$index + '.dliSCity'" :rules="LineInfoRules.dliSCity">-->
                    <!--      <el-select-->
                    <!--        ref="dliSCity"-->
                    <!--        clearable-->
                    <!--        size="mini"-->
                    <!--        v-model="scope.row.dliSCity"-->
                    <!--        :disabled="disabled"-->
                    <!--        @change="getDcS(scope.row)"-->
                    <!--        filterable-->
                    <!--      >-->
                    <!--        <el-option v-for="(item, index) in city" :key="index" :label="item.ctyeChnname" :value="item.ctyeCode"></el-option>-->
                    <!--      </el-select>-->
                    <!--    </el-form-item>-->
                    <!--  </el-col>-->
                    <!--  <el-col :span="8">-->
                    <!--    <el-form-item v-if="scope.row.status" :prop="'demandLineInfos.' + scope.$index + '.dliSArea'" :rules="LineInfoRules.dliSArea">-->
                    <!--      <el-select ref="dliSArea" clearable size="mini" v-model="scope.row.dliSArea" :disabled="disabled" filterable>-->
                    <!--        <el-option v-for="(item, index) in district" :key="index" :label="item.ctyChnname" :value="item.ctyCode"></el-option>-->
                    <!--      </el-select>-->
                    <!--    </el-form-item>-->
                    <!--  </el-col>-->
                    <!--</el-row>-->
                  </template>
                </el-table-column>
                <el-table-column prop="site" label="起始地详细地址" show-overflow-tooltip sortabl width="200">
                  <template slot-scope="scope">
                    <el-form-item v-if="scope.row.status" :prop="'demandLineInfos.' + scope.$index + '.site'" :rules="LineInfoRules.site">
                      <el-input :disabled="disabled" v-model="scope.row.site" maxlength="80" multiple clearable size="mini"></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="目的地的省市区县" width="400">
                  <template slot-scope="scope">
                    <el-form-item :prop="`demandLineInfos.${scope.$index}.endSelect`" :rules="[{ validator: endPlaceValidate, trigger: ['change', 'blur'] }]">
                      <el-cascader
                        v-model="scope.row.endSelect"
                        :options="provinceCityTree"
                        size="mini"
                        :props="cascaderProps"
                        @change="endPlaceChangeHandler(scope.$index)"
                        style="width: 100%"
                        filterable
                        clearable
                      ></el-cascader>
                    </el-form-item>
                    <!--<el-row :gutter="5">-->
                    <!--  <el-col :span="8">-->
                    <!--    <el-form-item v-if="scope.row.status" :prop="'demandLineInfos.' + scope.$index + '.dliDProvince'" :rules="LineInfoRules.dliDProvince">-->
                    <!--      <el-select clearable size="mini" v-model="scope.row.dliDProvince" :disabled="disabled" @change="getCityD(scope.row)" filterable>-->
                    <!--        <el-option v-for="(item, index) in province" :key="index" :label="item.prvChnname" :value="item.prvCode"></el-option>-->
                    <!--      </el-select>-->
                    <!--    </el-form-item>-->
                    <!--  </el-col>-->
                    <!--  <el-col :span="8">-->
                    <!--    <el-form-item v-if="scope.row.status" :prop="'demandLineInfos.' + scope.$index + '.dliDCity'" :rules="LineInfoRules.dliDCity">-->
                    <!--      <el-select-->
                    <!--        ref="dliDCity"-->
                    <!--        clearable-->
                    <!--        size="mini"-->
                    <!--        v-model="scope.row.dliDCity"-->
                    <!--        :disabled="disabled"-->
                    <!--        @change="getDcD(scope.row)"-->
                    <!--        filterable-->
                    <!--      >-->
                    <!--        <el-option v-for="(item, index) in city" :key="index" :label="item.ctyeChnname" :value="item.ctyeCode"></el-option>-->
                    <!--      </el-select>-->
                    <!--    </el-form-item>-->
                    <!--  </el-col>-->
                    <!--  <el-col :span="8">-->
                    <!--    <el-form-item v-if="scope.row.status" :prop="'demandLineInfos.' + scope.$index + '.dliDArea'" :rules="LineInfoRules.dliDArea">-->
                    <!--      <el-select ref="dliDArea" clearable size="mini" v-model="scope.row.dliDArea" :disabled="disabled" filterable>-->
                    <!--        <el-option v-for="(item, index) in district" :key="index" :label="item.ctyChnname" :value="item.ctyCode"></el-option>-->
                    <!--      </el-select>-->
                    <!--    </el-form-item>-->
                    <!--  </el-col>-->
                    <!--</el-row>-->
                  </template>
                </el-table-column>
                <el-table-column prop="destination" label="目的地详细地址" show-overflow-tooltip width="200">
                  <template slot-scope="scope">
                    <!-- <el-form   ref="demandLineInfos"  :model="basicForm"> -->
                    <el-form-item v-if="scope.row.status" :prop="'demandLineInfos.' + scope.$index + '.destination'" :rules="LineInfoRules.destination">
                      <el-input :disabled="disabled" v-model="scope.row.destination" maxlength="80" clearable size="mini"></el-input>
                    </el-form-item>
                    <!-- </el-form> -->
                  </template>
                </el-table-column>
              </el-table>
            </el-form>
          </div>
        </div>
      </div>
      <div class="dialog-footer1">
        <div class="btn">
          <el-button size="mini" @click="closeEdit">关闭</el-button>
          <el-button v-if="!disabled" size="mini" type="primary" @click="dialogSave">保存</el-button>
        </div>
      </div>
    </div>
    <el-dialog title="常用起始地" :modal="false" :visible.sync="historyDialog" v-if="historyDialog" style="top: 12vh" v-el-drag-dialog>
      <el-table
        :data="History"
        highlight-current-row
        border
        :height="solveDetailTableHeight"
        :header-cell-style="{ textAlign: 'center' }"
        @row-click="getCurrentOne"
      >
        <el-table-column type="index" align="center" width="60" label="序号"></el-table-column>
        <el-table-column align="left" prop="dliSProvinceName" label="省" show-overflow-tooltip width=""></el-table-column>
        <el-table-column align="left" prop="dliSCtiyeName" label="市" show-overflow-tooltip width=""></el-table-column>
        <el-table-column align="left" prop="dliSCityName" label="区县" show-overflow-tooltip width=""></el-table-column>
        <el-table-column align="left" prop="site" label="详细地址" show-overflow-tooltip width=""></el-table-column>
      </el-table>
      <div class="dialog-footer1">
        <div class="btn">
          <el-button size="mini" @click="historyDialog = false">取消</el-button>
          <el-button size="mini" type="primary" @click="historySave">确定</el-button>
        </div>
      </div>
    </el-dialog>
    <el-dialog title="常用目的地" :modal="false" :visible.sync="historyDialog2" v-if="historyDialog2" style="top: 12vh" v-el-drag-dialog>
      <el-table
        :data="HistoryEnd"
        highlight-current-row
        border
        :height="solveDetailTableHeight"
        :header-cell-style="{ textAlign: 'center' }"
        @row-click="getCurrentTwo"
      >
        <el-table-column type="index" align="center" width="60" label="序号"></el-table-column>
        <el-table-column align="left" prop="dliDProvinceName" label="省" show-overflow-tooltip width=""></el-table-column>
        <el-table-column align="left" prop="dliDCtiyeName" label="市" show-overflow-tooltip width=""></el-table-column>
        <el-table-column align="left" prop="dliDCityName" label="区县" show-overflow-tooltip width=""></el-table-column>
        <el-table-column align="left" prop="destination" label="详细地址" show-overflow-tooltip width=""></el-table-column>
      </el-table>
      <div class="dialog-footer1">
        <div class="btn">
          <el-button size="mini" @click="historyDialog2 = false">取消</el-button>
          <el-button size="mini" type="primary" @click="historySave2">确定</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  generateRequirementNumberService,
  getBrandListDropDownSer,
  getCompanysList,
  getNormListDropDownSer,
  getProjectBigDropDownSer,
  getRefCodesByType,
  getVarietiesDefaultDropDownSer,
  queryProvinceCityTree
} from '@/request/api'
import { addDmandService, delLineInfo, editDmandService } from '@/request/SugarFactory/sugarFactoryDmand/sugarDmand'
import {
  getDistrict,
  getDistrictDemand,
  getProvince,
  getUrban,
  getUrbanDemand,
  queryLineInfoHistoryDestination,
  queryLineInfoHistorySite
} from '@/request/dropDown'
import store from '@/store'

export default {
  name: 'dialog',
  props: {
    flt_info: {
      type: Object,
      required: true
    },
    demand_line_infos: {
      type: Object,
      required: true
    },
    disabled: {
      type: Boolean,
      default: false
    },
    disabledr: {
      type: Boolean,
      default: false
    },
    showDialog: {
      type: Boolean,
      required: false
    },
    dialogmode: {
      type: String
    }
  },
  data() {
    return {
      startPlaceValidate: (rule, value, callback) => {
        if (!value || !value.length) {
          callback(new Error('请选择起始地'))
          return
        }
        callback()
      },
      endPlaceValidate: (rule, value, callback) => {
        if (!value || !value.length) {
          callback(new Error('请选择目的地'))
          return
        }
        callback()
      },
      provinceCityTree: [], // 省市区县下拉 树
      cascaderProps: {
        value: 'code',
        label: 'name'
      },
      historyDialog: false,
      historyDialog2: false,
      historyForm: {
        History: [],
        dliSProvince: '',
        dliSCity: '',
        dliSArea: '',
        site: '',
        dliDProvince: '',
        dliDCity: '',
        dliDArea: '',
        destination: '',
        status: '1'
      },
      basicForm: {
        demandCode: '', // 需求编号
        kind: '', // 品种
        kindName: '', //品名
        transportType: '', // 运输类型（标的类型）
        transportMode: '', // 运输方式（公路、多式）
        dailyOutput: '', // 日产量 改为 规格
        transportQuantity: '', // 榨季期间运输数量 改为 货物的运输数量(吨)

        settlementWay: '', //结算方式
        specialRequire: [], //特殊要求（固定值：是否回收吊带.可多选）
        performanceBond: '', //履约保证金

        contractDeposit: '', // 合同定金

        goodCode: '', //货物编码
        projuctBig: '', //产品大类
        goodBrand: '', //货物品牌

        lsxl: '', //历史线路
        requiredStartTime: '', // 要求开始时间
        requiredEndTime: '', // 要求完成时间
        remark: '', // 备注
        demandLineInfos: [
          {
            site: '',
            destination: '',
            dailyShippingVolume: '',
            bidPrice: '',
            status: '1',
            dliSProvince: '',
            dliSCity: '',
            dliSArea: '',
            dliDProvince: '',
            dliDCity: '',
            dliDArea: '',
            startSelect: [],
            endSelect: []
          }
        ]
      },

      FLT_INFO: this.flt_info,
      dptFltIdList: [],
      basicRules: {
        demandCode: [{ required: true, message: '需求编号不能为空', trigger: 'blur' }],
        projuctBig: [{ required: true, message: '产品大类为空', trigger: 'blur' }],
        kind: [{ required: true, message: '品种不能为空', trigger: 'blur' }],
        kindName: [{ required: true, message: '品名不能为空', trigger: 'blur' }],
        goodCode: [{ required: true, message: '货物编码不能为空', trigger: 'blur' }],
        transportType: [{ required: true, message: '运输类型不能为空', trigger: 'blur' }],
        transportMode: [{ required: true, message: '运输方式不能为空', trigger: 'blur' }],
        goodBrand: [{ required: true, message: '货物品牌不能为空', trigger: 'blur' }],
        dailyOutput: [{ required: true, message: '规格不能为空', trigger: 'blur' }],
        transportQuantity: [
          { required: true, message: '运输数量不能为空', trigger: 'blur' },
          {
            // pattern: /^(([0-9]*)|(([0]\.\d{1,4}|[1-9][0-9]*\.\d{1,4})))$/,
            // 四位有效数字
            pattern: /^\d+$|^\d+\.\d{1,2}$/,
            message: '请输入不多于两位小数的运输数量',
            trigger: 'change'
          }
          // {
          //   pattern: /^[1-9]\d+$|^0\.\d{1,2}$/,
          //   message: '请输入非零的正确数字',
          //   trigger: 'blur'
          // }
        ],
        settlementWay: [{ required: true, message: '结算方式不能为空', trigger: 'blur' }],
        performanceBond: [
          // {required: true, message: '履约保证金不能为空', trigger: 'blur'},
          {
            // pattern: /^(([0-9]*)|(([0]\.\d{1,4}|[1-9][0-9]*\.\d{1,4})))$/,
            // 四位有效数字
            // pattern: /^[1-9]\.?\d{2}[1-9]$|^[1-9]{2}\.\d[1-9]$|^[1-9]{3}\.[1-9]$|^0\.\d{3}[1-9]$/,
            pattern: /^\d+$/,
            message: '请输入最多6位整数的正确金额',
            // message: '请输入四位有效数字的正确金额',
            trigger: 'change'
          }
          // {
          //   pattern: /^[1-9]\d+$/,
          //   message: '请输入非零的正确数字',
          //   // message: '请输入四位有效数字的正确金额',
          //   trigger: 'change'
          // }
        ],
        requiredStartTime: [{ required: true, message: '要求开始时间不能为空', trigger: 'blur' }],
        requiredEndTime: [{ required: true, message: '要求完成时间不能为空', trigger: 'blur' }],
        requiredEndDay: [
          { required: true, message: '要求完成天数不能为空', trigger: 'blur' },
          {
            pattern: /^([1-9])+([0-9])*$/,
            message: '请输入正确天数，只能为整数！',
            trigger: 'change'
          }
        ]
        // demandLineInfos: [{
        //   site: [
        //     { required: true, message: '起运地不能为空', trigger: 'blur' }
        //   ],
        //   destination: [
        //     { required: true, message: '目的地不能为空', trigger: 'blur' }
        //   ],
        //   dailyShippingVolume: [
        //     { required: true, message: '每日可完成运量不能为空', trigger: 'blur' }
        //   ],
        //   bidPrice: [
        //     { required: true, message: '竞标价格不能为空', trigger: 'blur' }
        //   ],
        // }]
      },
      LineInfoRules: {
        dliSProvince: [{ required: true, message: '起始地省不能为空', trigger: 'blur' }],
        dliSCity: [{ required: true, message: '起始地市不能为空', trigger: 'blur' }],
        dliSArea: [{ required: true, message: '起始地区县不能为空', trigger: 'blur' }],
        site: [{ required: true, message: '起始地不能为空', trigger: 'blur' }],
        dliDProvince: [{ required: true, message: '目的地省不能为空', trigger: 'blur' }],
        dliDCity: [{ required: true, message: '目的地市不能为空', trigger: 'blur' }],
        dliDArea: [{ required: true, message: '目的地区县不能为空', trigger: 'blur' }],
        destination: [{ required: true, message: '目的地不能为空', trigger: 'blur' }],
        dailyShippingVolume: [{ required: true, message: '每日可完成运量不能为空', trigger: 'blur' }]
        // bidPrice[stupid Demand]: [
        //   {required: true, message: '竞标价格不能为空', trigger: 'blur'}
        // ],
      },
      kinds: [], //品种下拉数据
      projuctBigs: [], //产品大类下拉
      goodBrands: [], //货物品牌下拉
      transportTypes: [], //运输类型下拉数据
      transportModels: [], //运输方式下拉数据
      dailyOutputs: [], //规格下拉数据
      jiesuanWays: [], //结算方式下拉数据
      specialRequirements: [], //特殊要求下拉数据 （是否回收吊带）
      solveDetailTableData: [], // 弹窗线路信息表格数据
      solveDetailTableHeight: 180, // 弹窗线路信息细表格高度
      mainBotCurrentData: '', // 弹窗 线路信息 当前行数据
      province: [], // 省下拉框
      city: [], // 市下拉框
      district: [], // 区县下拉框
      History: [], // 线路起运地历史记录
      HistoryEnd: [], // 线路目的地历史记录
      HistorySelected: [], // 线路历史记录

      historyCurrent: '',
      CurrentOne: '', // 当前选择起始地
      CurrentTwo: '', // 当前选择目的地
      oldCurrentOne: '', // 上次选择的起始地（当前为空用下一个）
      oldCurrentTwo: '' // 上次选择的目的地（当前为空用下一个）
    }
  },
  watch: {
    flt_info() {
      this.FLT_INFO = this.flt_info
      console.log('this.FLT_INFO', this.FLT_INFO)
    }
  },
  computed: {
    // 是否新增操作
    isAdd() {
      return this.dialogmode === this.DIALOG_MODE.ADD
    },
    rules() {
      return {
        dptSeq: [
          { required: true, message: '请输入糖厂序号', trigger: 'blur' }
          // {
          //   pattern: /^[0-9]+$/,
          //   message: '请输入数字',
          //   trigger: ['blur','change']
          // }
        ],
        dptCode: [
          { required: true, message: '请输入糖厂代码', trigger: 'blur' }
          // {
          //   pattern: /^[a-zA-Z0-9 ]+$/,
          //   message: '请输入英文和数字',
          //   trigger: ['blur','change']
          // }
        ],
        dptName: [
          { required: true, message: '请输入糖厂名称', trigger: 'blur' }
          // {
          //   pattern: /^[\u4e00-\u9fa5]+$/,
          //   message: '只能输入中文',
          //   trigger: 'change'
          // }
        ],
        fltName: [{ required: true, message: '请选择上级机构', trigger: ['blur', 'change'] }]
      }
    },
    startPickerOptions() {
      return {
        disabledDate: date => {
          // 设置可选择的日期为今天之后的一个月内
          let curDate = new Date().getTime()
          // 这里算出一个月的毫秒数,这里使用30的平均值,实际中应根据具体的每个月有多少天计算
          let day = 30 * 24 * 3600 * 1000
          let dateRegion = curDate + day
          return date.getTime() < Date.now() - 8.64e7
          // || date.getTime() > dateRegion
          // 设置选择的日期小于当前的日期,小于返回true,日期不可选
          // return time.getTime() < Date.now() - 8.64e7

          // if (!this.basicForm.requiredEndTime) return false
          // return (date.getTime()) > (new Date(this.basicForm.requiredEndTime).getTime())
        }
      }
    },
    endPickerOptions() {
      return {
        disabledDate: date => {
          if (!this.basicForm.requiredStartTime) return false
          return date.getTime() < new Date(this.basicForm.requiredStartTime).getTime()
        }
      }
    }
  },

  mounted() {
    queryProvinceCityTree().then(res => {
      this.provinceCityTree = res.data
    })
    this.basicForm = this.flt_info
    // this.solveDetailTableData = this.flt_info.demandLineInfos
    // this.solveDetailTableData.push(...this.flt_info.demandLineInfos)
    //运输类型下拉
    getVarietiesDefaultDropDownSer({
      fltId: store.state.user.FLT_UUID_DX_H,
      dptId: store.state.user.DPTID_DX_H
    }).then(res => {
      if (res.success === '1') {
        this.kinds = res.data
      }
    }),
    //产品大类下拉
    getProjectBigDropDownSer({
      fltId: store.state.user.FLT_UUID_DX_H,
      dptId: store.state.user.DPTID_DX_H
    }).then(res => {
      if (res.success === '1') {
        this.projuctBigs = res.data
      }
    })
    //货物品牌下拉
    getBrandListDropDownSer({
      fltId: store.state.user.FLT_UUID_DX_H,
      dptId: store.state.user.DPTID_DX_H
    }).then(res => {
      if (res.success === '1') {
        this.goodBrands = res.data
      }
    })
    //运输类型下拉
    getRefCodesByType('标的类型').then(res => {
      if (res.success === '1') {
        this.transportTypes = res.data
      }
    }),
    //运输方式下拉
    getRefCodesByType('运输类型').then(res => {
      if (res.success === '1') {
        this.transportModels = res.data
      }
    }),
    //货物规格下拉
    // getRefCodesByType('货物规格').then(res => {
    //   if (res.success === '1') {
    //     this.dailyOutputs = res.data
    //   }
    // }),
    getNormListDropDownSer({
      fltUuid: store.state.user.FLT_UUID_DX_H,
      depId: store.state.user.DPTID_DX_H
    }).then(res => {
      if (res.success === '1') {
        this.dailyOutputs = res.data
      }
    })
    //结算方式
    getRefCodesByType('网络_结算方式').then(res => {
      if (res.success === '1') {
        this.jiesuanWays = res.data
      }
    }),
    //是否回收吊带
    getRefCodesByType('特殊要求').then(res => {
      if (res.success === '1') {
        this.specialRequirements = res.data
      }
    }),
    getProvince().then(res => {
      if (res.success === '1') {
        this.province = res.data
      }
    }),
    getUrbanDemand({
      dliSCity: this.demand_line_infos.dliSCity,
      dliDCity: this.demand_line_infos.dliDCity
    }).then(res => {
      if (res.success === '1') {
        this.city = res.data
      }
    }),
    getDistrictDemand({
      dliSArea: this.demand_line_infos.dliSArea,
      dliDArea: this.demand_line_infos.dliDArea
    }).then(res => {
      if (res.success === '1') {
        this.district = res.data
      }
    })
    // queryLineInfoHistory({sugarId: ''}).then(res => {
    //   this.History = res.data
    // }),
    queryLineInfoHistorySite({}).then(res => {
      if (res.success === '1') {
        this.History = res.data
      }
    }),
    queryLineInfoHistoryDestination({}).then(res => {
      if (res.success === '1') {
        this.HistoryEnd = res.data
      }
    }),
    this.getGoodsNum(this.basicForm.kind),
    this.$refs.basicForm.clearValidate()
  },
  methods: {
    changeLineInfo(lsxl) {
      let flag = 1
      this.basicForm.demandLineInfos = this.History.filter(f => f.site == lsxl).map(map => {
        if ((map.site == lsxl) & (flag == 1)) {
          flag += 1
          return {
            dliSProvince: map.dliSProvince,
            dliSCity: map.dliSCity,
            dliSArea: map.dliSArea,
            site: map.site,
            dliDProvince: map.dliDProvince,
            dliDCity: map.dliDCity,
            dliDArea: map.dliDArea,
            destination: map.destination,
            status: '1'
          }
        }
      })
      // this.basicForm.demandLineInfos[0] = this.HistorySelected[0]
    },
    //绑定运输方式和运输类型下拉值
    getType(val) {
      if (val == 'ZJZY') {
        this.basicForm.transportMode = 'RO'
      }
      if (val == 'XSWL') {
        this.basicForm.transportMode = 'DS'
      }
    },
    // 线路信息  新增按钮
    lineInfoAdd() {
      let list = {
        lineId: '',
        sugarId: '',
        site: '',
        destination: '',
        dailyShippingVolume: '',
        bidPrice: '',
        lineRemark: '',
        status: 1
      }
      this.basicForm.demandLineInfos.push(list)
      // list['changePort'] = this.makeChange(list) // 获取 解决方案  起始，目的港站  下拉框
      // list['changePort1'] = this.makeChange1(list)
    },
    closeEdit() {
      // 关闭时清楚验证信息
      this.showDialog = false
      this.$emit('closeEdit')
    },

    // 监听主页下方表格的展示
    handleChange(val) {
      if (val.length == 0) {
        this.mainTopHeight = 660
      } else {
        this.mainTopHeight = 400
      }
    },
    // 弹窗保存按钮
    dialogSave() {
      if (this.dialogmode == '新增' || this.dialogmode == '复制需求') {
        this.$refs.basicForm.validate(valid => {
          console.log(valid)
          if (valid) {
            this.$refs.demandLineInfos.validate(valida => {
              console.log(valida)
              if (valida) {
                let needArr = Object.assign(this.basicForm, { demandLineInfos: this.basicForm.demandLineInfos })
                addDmandService(needArr).then(res => {
                  if (res.msg == '2002') {
                    this.$confirm('需求编号重复(点击确认刷新需求编号)', '提示', {
                      confirmButtonText: '确定',
                      showCancelButton: false
                    }).then(() => {
                      generateRequirementNumberService().then(res => {
                        this.basicForm.demandCode = res.data
                      })
                    })
                  } else {
                    if (res.success == 1) {
                      this.$message({
                        type: 'success',
                        message: this.dialogmode == '新增' ? '新增成功' : '复制需求成功'
                      })
                      this.$emit('dialogSave', false)
                      this.mainBotTableData = []
                    }
                  }
                })
              }
            })
          }
        })
      } else if (this.dialogmode == '编辑') {
        this.$refs.basicForm.validate(valid => {
          if (valid) {
            this.$refs.demandLineInfos.validate(valida => {
              if (valida) {
                let needArr = Object.assign(this.basicForm, { demandLineInfos: this.basicForm.demandLineInfos })
                editDmandService(needArr).then(res => {
                  if (res.success == 1) {
                    this.$message({
                      type: 'success',
                      message: '编辑成功'
                    })
                    this.$emit('dialogSave', false)
                    this.mainBotTableData = []
                    this.closeEdit()
                  }
                })
              }
            })
          }
        })
      }
    },
    // 弹窗内  解决方案明细  删除
    solveDetailDel() {
      if (this.mainBotCurrentData.length == 0) {
        this.$alert('请选择一条数据', '提示', {
          confirmButtonText: '确定'
        })
        return
      }
      if (this.dialogmode == '新增') {
        this.basicForm.demandLineInfos = this.basicForm.demandLineInfos.filter(item => {
          return item != this.mainBotCurrentData
        })
      } else if (this.dialogmode == '编辑') {
        if (this.mainBotCurrentData.lineId) {
          delLineInfo({ lineId: this.mainBotCurrentData.lineId }).then(res => {
            if (res.success == 1) {
              this.$message({
                type: 'success',
                message: '删除成功!'
              })
              this.basicForm.demandLineInfos = this.basicForm.demandLineInfos.filter(item => {
                return item != this.mainBotCurrentData
              })
            }
          })
        } else {
          this.basicForm.demandLineInfos = this.basicForm.demandLineInfos.filter(item => {
            return item != this.mainBotCurrentData
          })
        }
      }
    },
    // 弹窗内 箱子  当前行数据
    getBasicTableData(row) {
      this.basicTableCurrentData = row
    },
    // 获取 弹窗 解决方案明细 表格当前行
    getMainBotCurrent(row) {
      this.mainBotCurrentData = row
    },
    getCompanys() {
      getCompanysList().then(res => {
        this.dptFltIdList = res.data
      })
    },
    getGoodsNum(kind) {
      // console.log(kind, 'kind')
      // generategoodsNumberService({kind: kind}).then(res => {
      //   this.basicForm.goodCode = res.data
      // })
    },

    //获取区
    getDc(name) {
      this.district = []
      if (name) {
        getDistrict({ ctyeCode: name }).then(res => {
          if (res.success === '1') {
            this.district = res.data
          }
        })
      }
    },
    //获取区
    getDcS(name) {
      this.district = []
      if (name.dliSCity) {
        getDistrict({ ctyeCode: name.dliSCity }).then(res => {
          if (res.success === '1') {
            this.district = res.data
          }
        })
      }
      if (name.dliSArea) {
        name.dliSArea = ''
      }
    },

    //获取区
    getDcD(name) {
      this.district = []
      if (name.dliDCity) {
        getDistrict({ ctyeCode: name.dliDCity }).then(res => {
          if (res.success === '1') {
            this.district = res.data
          }
        })
      }
      if (name.dliDArea) {
        name.dliDArea = ''
      }
    },
    //获取市
    getCity(name) {
      this.city = []
      if (name) {
        getUrban({ prvCode: name }).then(res => {
          if (res.success === '1') {
            this.city = res.data
          }
        })
      }
    },
    //获取市
    getCityS(name) {
      this.city = []
      if (name.dliSProvince) {
        getUrban({ prvCode: name.dliSProvince }).then(res => {
          if (res.success === '1') {
            this.city = res.data
          }
        })
      }
      if (name.dliSCity) {
        name.dliSCity = ''
      }
      if (name.dliSArea) {
        name.dliSArea = ''
      }
    },
    //获取市
    getCityD(name) {
      this.city = []
      if (name.dliDProvince) {
        getUrban({ prvCode: name.dliDProvince }).then(res => {
          if (res.success === '1') {
            this.city = res.data
          }
        })
      }
      if (name.dliDCity) {
        name.dliDCity = ''
      }
      if (name.dliDArea) {
        name.dliDArea = ''
      }
    },

    getWillDate(dayCount) {
      let day = dayCount * 24 * 3600 * 1000
      this.basicForm.requiredEndTime = new Date(Date.parse(this.basicForm.requiredStartTime) + day)
    },
    getWillDateByStart(startTime) {
      let day = this.basicForm.requiredEndDay * 24 * 3600 * 1000
      this.basicForm.requiredEndTime = new Date(Date.parse(startTime) + day)
    },

    lineInfoHistory() {
      (this.CurrentTwo = this.basicForm.demandLineInfos[0]), (this.oldCurrentOne = this.CurrentOne)
      ;(this.CurrentOne = ''), // 当前选择起始地
      (this.historyDialog = true)
    },
    lineInfoHistory2() {
      (this.CurrentOne = this.basicForm.demandLineInfos[0]), (this.oldCurrentTwo = this.CurrentTwo)
      ;(this.CurrentTwo = ''), // 当前选择目的地
      (this.historyDialog2 = true)
    },
    getCurrentOne(row) {
      this.CurrentOne = row
    },
    getCurrentTwo(row) {
      this.CurrentTwo = row
    },
    historySave() {
      if (Object.keys(this.CurrentOne).length == 0) {
        this.$alert('请选择常用起始地！', '提示', {
          confirmButtonText: '确定'
        })
        return
      }
      let hasValue = Object.keys(this.CurrentTwo).length == 0 ? this.oldCurrentTwo : this.CurrentTwo
      this.historyCurrent = {
        dliSProvince: this.CurrentOne.dliSProvince,
        dliSCity: this.CurrentOne.dliSCity,
        dliSArea: this.CurrentOne.dliSArea,
        site: this.CurrentOne.site,
        dliDProvince: hasValue.dliDProvince,
        dliDCity: hasValue.dliDCity,
        dliDArea: hasValue.dliDArea,
        destination: hasValue.destination,
        status: '1',
        lineId: hasValue.lineId,
        startSelect: [this.CurrentOne.dliSProvince, this.CurrentOne.dliSCity, this.CurrentOne.dliSArea],
        endSelect: [hasValue.dliDProvince, hasValue.dliDCity, hasValue.dliDArea]
      }
      this.$set(this.basicForm.demandLineInfos, 0, this.historyCurrent)

      this.historyDialog = false
      this.$forceUpdate()
    },
    historySave2() {
      if (Object.keys(this.CurrentTwo).length == 0) {
        this.$alert('请选择常用目的地！', '提示', {
          confirmButtonText: '确定'
        })
        return
      }
      let hasValue = Object.keys(this.CurrentOne).length == 0 ? this.oldCurrentOne : this.CurrentOne
      this.historyCurrent = {
        dliSProvince: hasValue.dliSProvince,
        dliSCity: hasValue.dliSCity,
        dliSArea: hasValue.dliSArea,
        site: hasValue.site,
        dliDProvince: this.CurrentTwo.dliDProvince,
        dliDCity: this.CurrentTwo.dliDCity,
        dliDArea: this.CurrentTwo.dliDArea,
        destination: this.CurrentTwo.destination,
        status: '1',
        lineId: hasValue.lineId,
        startSelect: [hasValue.dliSProvince, hasValue.dliSCity, hasValue.dliSArea],
        endSelect: [this.CurrentTwo.dliDProvince, this.CurrentTwo.dliDCity, this.CurrentTwo.dliDArea]
      }

      this.$set(this.basicForm.demandLineInfos, 0, this.historyCurrent)
      this.historyDialog2 = false
      this.$forceUpdate()
    },
    startPlaceChangeHandler(index) {
      this.basicForm.demandLineInfos[index].dliSProvince = this.basicForm.demandLineInfos[index].startSelect[0]
      this.basicForm.demandLineInfos[index].dliSCity = this.basicForm.demandLineInfos[index].startSelect[1]
      this.basicForm.demandLineInfos[index].dliSArea = this.basicForm.demandLineInfos[index].startSelect[2]
    },
    endPlaceChangeHandler(index) {
      this.basicForm.demandLineInfos[index].dliDProvince = this.basicForm.demandLineInfos[index].endSelect[0]
      this.basicForm.demandLineInfos[index].dliDCity = this.basicForm.demandLineInfos[index].endSelect[1]
      this.basicForm.demandLineInfos[index].dliDArea = this.basicForm.demandLineInfos[index].endSelect[2]
    }
  },
  created() {}
}
</script>

<style lang="scss" scoped>
.el-form-item {
  margin-bottom: 2.5rem !important;
}

// 弹窗内的样式
.dialogBox {
  width: 100%;
  height: 100%;
  border: 1px solid #ccc;
  padding-top: 0px;
  margin-top: -30px;
  line-height: 2.4rem;

  .dialogTopBox {
    width: 100%;
    border-bottom: 1px solid #ccc;
    display: flex;
    justify-content: space-between;
    background: #f0f8fb;
    padding-top: 20px;
  }

  .dialogBotBox {
    .botTitl {
      font-size: 18px;
      padding: 10px 0 10px 0px;
    }

    .lsxl {
      padding-top: 1px;
      padding-bottom: 0px;
    }

    .botBtnBox {
      padding-left: 5px;
      padding-top: 0px;
    }

    ::v-deep .solveDetailTable {
      padding-top: -1px;

      .el-input__inner {
        padding: 0;
      }

      .cell.el-tooltip {
        padding: 0;
      }
    }
  }
}

.area {
  display: flex;
  justify-content: space-evenly;
}

.dialog-footer1 {
  position: relative;
  width: 100%;
  height: 40px;
  padding-top: 20px;
  /*float: right;*/
  .btn {
    position: absolute;
    right: 15px;
  }
}

// .el-date-editor.el-input, .el-date-editor.el-input__inner {
//   width: 195px;
// }

.el-dialog__header {
  padding: 20px 0px 0px 20px;
}

.box {
  padding: 12px 12px 1px 12px;
  position: relative;
  border: 1px solid rgb(29, 158, 233);
  border-radius: 5px;
  // height:300px;
  margin-bottom: 20px;

  .grid-content {
    height: 44px;
  }

  .name {
    position: absolute;
    top: -20px;
    font-size: 16px;
    font-weight: 700;
    padding: 10px;
    line-height: 20px;
    background: #fff;
  }
}
</style>
